<template>
<!--pages/wcs/privil-card/priviledge/priviledge.wxml-->

<view class="pri-card">   
    <view v-for="(item, index) in list" :key="index" class="card-item" @tap.stop="info" :data-id="item.level_id">
        <view class="card-text">
            <view class="cardtit">
                <view class="cardicon"><image src="/static/images/icon.png"></image></view>
                <text class="big-txt">{{item.level_name}}</text>
            </view>
            <text class="sm-txt">{{item.introduction||''}}</text>
            <text class="cad-price">￥{{item.join_price}}元</text>
        </view>
    </view>
</view>
</template>

<script>
// pages/wcs/privil-card/priviledge/priviledge.js
var app = getApp();
var request = app.globalData.request;
var setting = app.globalData.setting;
import LoadMore from "../../../utils/LoadMore";
var load = new LoadMore();

export default {
  data() {
    return {
      url: setting.url,
      currentPage: 1
    };
  },

  components: {},
  props: {},

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    load.init(this, '', 'list');
    this.getDistributList();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {},

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    load.resetConfig();
    this.getDistributList();
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    load.canloadMore();
    this.getDistributList();
  },
  methods: {
    getDistributList() {
      var that = this;
      var requestUrl = '/api/distribut/distribut_list?p=' + that.currentPage;
      load.request(requestUrl, function () {
        that.currentPage++;
      });
    },

    info: function (e) {
      uni.navigateTo({
        url: '/pages/distribut/distribut_detail/distribut_detail?id=' + e.currentTarget.dataset.id
      });
    }
  }
};
</script>
<style>
/* pages/wcs/privil-card/priviledge/priviledge.wxss */

.pri-card{
  padding: 30rpx 30rpx 0 30rpx; 
  min-height: 1080rpx;
  overflow: hidden;
}
.card-item{
  width: 100%;
  height: 360rpx;
  margin-bottom: 40rpx;
  background-color: #fff;
  border-radius: 10rpx;
  overflow: hidden;
}
.card-text{
  width: 640rpx;
  height: 320rpx;
  border: 1px solid #f3f3f3;
  margin: 20rpx auto 0;
  border-radius: 10rpx;
}
.cardtit{
    margin-top: 20rpx;
    overflow: hidden;
    padding-left: 30rpx;
}
.cardicon{
    float: left;
    width: 100rpx;
    height: 100rpx;
    background-color: #1d9f85;
    border-radius: 100%;
}
.cardicon image{
  width: 72rpx;
  height: 50rpx;
  margin: 25rpx 0 25rpx 14rpx;
}
.cardtit .big-txt{
  font-size: 36rpx;
  margin-left: 30rpx;
  margin-top: 20rpx;
  font-weight: bold;
  float: left;
}
.card-text .sm-txt{
  font-size: 30rpx;
  display: block;
  margin: 30rpx 0 50rpx 100rpx;
}
.card-text .cad-price{
  float: right;
  margin-right: 40rpx;
}
.card-text text{
    color: #1d9f85;
}




</style>